<template>
  <div>
    <button v-on:click="fn">点击</button>
    <button @click="fn">点击</button>
    <button @click="huaMoney(300000)">娶老婆</button>
    <button @click="huaMoney(200000)">买车</button>
    <button @click="huaMoney(800000)">买房</button>
    <div
 @click="divClick"
 style="width: 200px; height: 200px; border: 1px solid red"
  >
  <button @click="innerClick($event, 100)">内层的button</button>
 </div>
 </div>
</template>
<script>
export default {
  name: 'on-component',
  methods: {
    fn() {
      console.log('事件触发了');
    },
    huaMoney(money) {
      console.log('花了'+ money + '元');
    },
    divClick() {
      console.log('div点击了');
    },
    innerClick(num, e) {
      e.stopPropagation()
      console.log('内层button点击');
    }
  }
}
</script>